<template>
    <div>
        <el-dialog v-model="props.visible" title="选择制版内容" width="80%" @close="handleCancel">
            <el-form :model="queryParams" class="flex-box" ref="queryRef" :inline="true">
                <div>
                    <el-form-item label="生产单编码" prop="produceNo">
                        <el-input
                            v-model.trim="queryParams.produceNo"
                            placeholder="请输入生产单编码"
                            @keyup.enter="handleQuery"
                        />
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" icon="Search" @click="handleQuery">
                            搜索
                        </el-button>
                        <el-button icon="Refresh" @click="resetQuery">重置</el-button>
                    </el-form-item>
                </div>
                <el-button type="primary" plain @click="handleSubmit" :disabled="multiple">
                    确认
                </el-button>
            </el-form>
            <el-row :gutter="20" style="overflow: auto">
                <el-col :span="8">
                    <!-- -->
                    <el-table
                        v-loading="loading"
                        :data="orderList"
                        stripe
                        border
                        style="cursor: pointer"
                        ref="orderListTable"
                        row-key="produceId"
                        @cell-click="handleClickRow"
                        @selection-change="handleSelectionChange"
                        highlight-current-row
                    >
                        <el-table-column type="selection" :reserve-selection="true" width="55" />
                        <el-table-column label="序号" width="55" type="index" align="center" />
                        <el-table-column
                            label="生产单编码"
                            align="center"
                            prop="produceNo"
                        ></el-table-column>
                        <el-table-column
                            label="出版编码"
                            align="center"
                            prop="pubNo"
                        ></el-table-column>
                        <el-table-column
                            label="类型"
                            align="center"
                            prop="type"
                        >
                            <template v-slot="{ row }">
                                <el-tag :type="row.type == 1 ? 'success' : ''" effect="dark">
                                    {{ row.type == 1 ? '封面' : '内文' }}
                                </el-tag>
                            </template>
                        </el-table-column>
                    </el-table>
                </el-col>
                <el-col :span="16">
                    <el-table
                        ref="orderRef"
                        v-loading="loadingInfo"
                        :data="printList"
                        row-key="paperid"
                        stripe
                        border
                        style="cursor: pointer"
                    >
                        <!-- @selection-change="handleSelectionChange" -->
                        <!-- <el-table-column type="selection" :reserve-selection="true" width="55" /> -->
                        <el-table-column
                            label="印刷序列号"
                            min-width="120"
                            prop="printProduceNo"
                            align="center"
                        ></el-table-column>
                        <el-table-column label="品种" prop="breed" min-width="160" align="center">
                            <!-- <template #default="scope">
                                <dict-tag
                                    :options="ems_order_breed_type"
                                    :value="scope.row.breed"
                                />
                            </template> -->
                        </el-table-column>
                        <el-table-column
                            label="组成"
                            min-width="160"
                            prop="composition"
                            align="center"
                        >
                            <!-- <template #default="scope">
                                <dict-tag
                                    :options="ems_order_make_up_fm"
                                    :value="scope.row.composition"
                                />
                            </template> -->
                        </el-table-column>
                        <el-table-column
                            label="印数"
                            width="120"
                            prop="printAmount"
                            align="center"
                        ></el-table-column>
                        <el-table-column label="印色" width="120" prop="printColour" align="center">
                            <template #default="scope">
                                <dict-tag
                                    :options="ems_order_print_color"
                                    :value="scope.row.printColour"
                                />
                            </template>
                        </el-table-column>
                        <el-table-column
                            label="版材数量"
                            width="120"
                            prop="sheetAmount"
                            align="center"
                        ></el-table-column>
                        <el-table-column
                            label="版材尺寸"
                            prop="sheetSize"
                            width="120"
                            align="center"
                        >
                            <template #default="scope">
                                <dict-tag
                                    :options="ems_machine_info_size"
                                    :value="scope.row.sheetSize"
                                />
                            </template>
                        </el-table-column>
                    </el-table>
                </el-col>
            </el-row>
            <div class="footer">
                <pagination
                    v-show="total > 0"
                    :total="total"
                    v-model:page="queryParams.pageNum"
                    v-model:limit="queryParams.pageSize"
                    @pagination="getList"
                />
            </div>
        </el-dialog>
    </div>
</template>

<script setup>
import { getProducestatelist } from '@/api/production/platemaking.js'
import { getProduceById, leftListZhi } from '@/api/production/cover'
const emit = defineEmits(['changeUpdate', 'cancel'])
const { proxy } = getCurrentInstance()
const { ems_order_make_up_fm,ems_machine_info_size, ems_order_make_up, ems_order_print_color, ems_order_breed_type } =
    proxy.useDict(
        'ems_order_breed_type',
        'ems_machine_info_size',
        'ems_order_make_up',
        'ems_order_print_color',
        'ems_order_make_up_fm',
    )

const props = defineProps({
    visible: {
        type: Boolean,
        default: false,
    },
    orderSelectList: {
        type: Array,
        default: () => {
            ;[]
        },
    },
})

const orderRef = ref(null)
const orderList = ref([])
const printList = ref([])
const multiple = ref(true)
const selectRow = ref([])
const loading = ref(false)
const loadingInfo = ref(false)
const orderListTable = ref(null)
const queryParams = ref({
    pageNum: 1,
    pageSize: 10,
    orderMark: 'left_zhi',
})
watch(
    () => props.visible,
    val => {
        if (val) {
            handleQuery()
            nextTick(() => {
                orderListTable.value.clearSelection()
                if (props.orderSelectList.length > 0) {
                    props.orderSelectList.forEach(item => {
                        orderListTable.value.toggleRowSelection(item, true)
                    })
                }
            })
        }
    }
)
const total = ref(0)
// 选中订单
const handleClickRow = row => {
    handleClick(row).then(res => {
        printList.value = res
    })
}
const handleClick = row => {
    return new Promise(resolve => {
        loadingInfo.value = true
        // makeStatus 1做版，2制版，3取板
        getProduceById({ pid: row.produceId }).then(res => {
            let list = []
            res.data.producePrintList.forEach(item => {
                item.producePrintId = item.printId
                item.produceNo = res.data.produceNo
                item.pubNo = res.data?.pubNo
                item.createTime = undefined
                res.data.produceProductList.forEach(ele => {
                    if (item.orderProductId == ele.orderProductId) {
                        item.breed = ele.breedType
                        item.bookName = ele.bookName
                        item.orderNo = ele.orderNo
                        // newPast 是否做版已经去除
                        // item.newPast = ele.newPast
                    }
                })
            })
            // if (res.data.status == 3) {
            //     list = res.data.producePrintList
            // } else {
            //     list = res.data.producePrintList.filter(item => item.newPast == 2)
            // }
            list = res.data.producePrintList
            loadingInfo.value = false
            resolve(list)
        })
    })
}

// 选中
const handleSelectionChange = row => {
    selectRow.value = row
    multiple.value = !row.length
}
const handleSubmit = () => {
    handleAllClicks()
}
async function handleAllClicks() {
    const resp = []
    for (const item of selectRow.value) {
        try {
            const res = await handleClick(item)
            res.forEach(item => {
                resp.push(item)
            })
        } catch (error) {
            console.error(error)
            // 处理每个 handleClick 异步函数的拒绝原因
        }
    }
    emit('changeUpdate', resp)
}

const handleCancel = () => {
    proxy.resetForm('queryRef')
    emit('cancel')
}
const getList = async () => {
    loading.value = true
    const res = await leftListZhi(queryParams.value)
    if (res.rows.length > 0) {
        orderListTable.value.setCurrentRow(res.rows[0])
    }
    loading.value = false
    orderList.value = res.rows
    if (orderList.value.length) {
        handleClick(orderList.value[0]).then(res => {
            printList.value = res
        })
    }
    total.value = res.total
}
// 搜索
const handleQuery = () => {
    queryParams.value.pageNum = 1
    getList()
}
/** 重置按钮操作 */
const resetQuery = () => {
    proxy.resetForm('queryRef')
    handleQuery()
}

// getList()
</script>

<style lang="scss" scoped></style>
